<template>
    <el-container>
        <el-header>
            <PrimaryButton text="增加" :click="showAdd" />
        </el-header>
        <el-main>
            <el-table stripe :data="tableData" element-loading-text="拼命加载中" element-loading-spinner="el-icon-loading" element-loading-background="rgba(0, 0, 0, 0.8)" v-loading.fullscreen.lock="loading">
                <el-table-column prop="name" label="案例名称" width="180" />
                <el-table-column prop="num" label="案例数量" width="80" />
                <el-table-column prop="sort" label="排序" width="95" />
                <el-table-column prop="createTime" label="创建时间" width="220" />
                <el-table-column label="操作" width="200">
                    <template #="{mu}">
                        <PlainButton text="删除" :click="() => doDelete(mu)" />
                    </template>
                </el-table-column>
            </el-table>
            <SearchPagination :currentPage="currentPage" :total="total" :limit="limit" @handleCurrentChange="handleCurrentChange" @handleSizeChange="handleSizeChange" />
        </el-main>
        <el-footer>
            <el-dialog width="35%" title="添加案例量" :visible="showAddForm">
                <el-form ref="form" :rules="rules" :model="form" label-width="100px">
                    <el-form-item label="案例名称" prop="name">
                        <el-input v-model="form.name" placeholder="请输入案例名称" />
                    </el-form-item>
                    <el-form-item label="城市数量" prop="num">
                        <el-input v-model="form.num" placeholder="请输入案例数量" />
                    </el-form-item>
                    <el-form-item label="排序" prop="sort">
                        <el-input v-model="form.sort" placeholder="数字越大，排在越前面" />
                    </el-form-item>
                    <el-form-item>
                        <PrimaryButton text="确定" :click="doAdd" />
                    </el-form-item>
                </el-form>
            </el-dialog>
        </el-footer>
    </el-container>
</template>
<script>
import { page, create, remove } from '@/chaos/functions/mixin/crud';
import { goBack } from '@/chaos/functions/mixin/pushcrud';

export default {
    name: 'doctoral',
    mixins: [page, remove, create, goBack],
    data() {
        const rules = {
            name: [
                { required: true, message: '请输入案例名称', trigger: 'blur' }
            ],
            num: [
                { required: true, message: '请输入案例数量', trigger: 'blur' }
            ],
            sort: [{ required: true, message: '请输入排序', trigger: 'blur' }]
        };
        return {
            domain: 'iya_doctor_al',
            indexPath: 'doctors',
            rules
        };
    },
    created() {
        if (!this.$route.params.doctorMu) {
            this.$router.push(this.indexPath);
            return;
        }
        this.data.doctorMu = this.$route.params.doctorMu;
        this.form.doctorMu = this.data.doctorMu;
        this.search();
    }
};
</script>
<style lang="less" scoped>
.el-page-header {
    margin-bottom: 10px;
}

.el-form {
    width: 500px;
}
</style>
